<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>Examples</title>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <link href="" rel="stylesheet">
    <script src="../js/qiniu.js"></script>
    <script src="../js/plupload.full.min.js"></script>
    <script src="./js/jquery-1.9.0.min.js"></script>
</head>

<body>
    <div id="btn-uploader">
        <a id="pickfiles" href="javascript:void 0;">Upload File</a>
    </div>
</body>
<script>
var f_name = '';
var uploader = Qiniu.uploader({
    runtimes: 'html5,flash,html4',
    browse_button: 'pickfiles', //上传按钮的ID
    container: 'btn-uploader', //上传按钮的上级元素ID
    drop_element: 'btn-uploader',
    max_file_size: '512kb', //最大文件限制
    flash_swf_url: '/static/js/plupload/Moxie.swf',
    dragdrop: true,
    chunk_size: '512kb', //分块大小
    uptoken_func: function() {
        var q_url = 'http://106.75.137.2:8888/api/admin/pedia/up_token/?filename=';
        f_name = generateMixed(64);
        q_url = q_url + f_name;
        var uptoken = '';
        var xhr = createXHR();

        xhrthen(xhr, function() {
            respon = JSON.parse(xhr.responseText);
            console.log(respon)
            uptoken = respon.up_token;
        });

        xhr.open('get', q_url, false);
        xhr.send();
        console.log(f_name)
        console.log(uptoken)

        return uptoken;

        function generateMixed(n) {
        	var chars = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z'];
            var res = "";
            for (var i = 0; i < n; i++) {
                var id = Math.ceil(Math.random() * 35);
                res += chars[id];
            }
            return res;
        }

        function createXHR() {
            if (window.XMLHttpRequest) {
                // 新浏览器
                return new XMLHttpRequest();
            } else if (window.ActiveXObject) {
                // IE5,IE6
                return new ActiveXObject("Microsoft.XMLHTTP");
            }
        }

        function xhrthen(xhr, callback) {
            xhr.onreadystatechange = function() {
                if (xhr.readyState == 4) {
                    if (xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) {
                        console.log(xhr.responseText)
                        callback();
                    } else {
                        console.log(xhr.status)
                        console.log(xhr.responseText)
                        callback();
                    }
                }
            };
        };
    },

    //设置请求qiniu-token的url
    //Ajax请求upToken的Url，**强烈建议设置**（服务端提供）
    // uptoken : '<Your upload token>',
    //若未指定uptoken_url,则必须指定 uptoken ,uptoken由其他程序生成
    // unique_names: true,
    // 默认 false，key为文件名。若开启该选项，SDK会为每个文件自动生成key（文件名）
    // save_key: true,
    // 默认 false。若在服务端生成uptoken的上传策略中指定了 `sava_key`，则开启，SDK在前端将不对key进行任何处理
    domain: 'http://o8covea2w.bkt.clouddn.com/', //自己的七牛云存储空间域名
    //multi_selection: true, //是否允许同时选择多文件
    //文件类型过滤，这里限制为图片类型
    filters: {
        mime_types: [{
            title: "Image files",
            extensions: "jpg,jpeg,gif,png"
        }]
    },
    get_new_uptoken: true,
    //每次get新的token
    auto_start: true,
    init: {
        'FilesAdded': function(up, files) {
            //do something
            console.log(up)
            console.log(files)
        },
        'BeforeUpload': function(up, file) {
            //do something
        },
        'UploadProgress': function(up, file) {
            //可以在这里控制上传进度的显示
            //可参考七牛的例子
        },
        'UploadComplete': function() {
            //do something
        },
        'FileUploaded': function(up, file, info) {
            //每个文件上传成功后,处理相关的事情
            //其中 info 是文件上传成功后，服务端返回的json，形式如
            //{
            //  "hash": "Fh8xVqod2MQ1mocfI4S4KpRL6D98",
            //  "key": "gogopher.jpg"
            //}
            console.log(info)
            var domain = up.getOption('domain');
            var res = eval('(' + info + ')');
            var sourceLink = domain + res.key; //获取上传文件的链接地址

            console.log(sourceLink)

        },
        'Error': function(up, err, errTip) {
            console.log(err)
            alert(errTip);
        },
        'Key': function(up, file) {
            var key = f_name;
            return key
        }
    }
});
</script>

</html>
